- add_to_breadcrumbs _("Topics"), topics_explore_projects_path
- breadcrumb_title @topic.title_or_name
- page_title @topic.title_or_name, _("Topics")
- max_topic_title_length = 50

= render_dashboard_ultimate_trial(current_user)

.gl-text-center.gl-bg-gray-10.gl-pb-3.gl-pt-6
  %div{ class: container_class }
    .gl-pb-5.gl-align-items-center.gl-justify-content-center.gl-display-flex
      = render Pajamas::AvatarComponent.new(@topic, size: 64, alt: '')
      - if @topic.title_or_name.length > max_topic_title_length
        %h1.gl-mt-3.gl-ml-5.gl-str-truncated.has-tooltip{ title: @topic.title_or_name }
          = truncate(@topic.title_or_name, length: max_topic_title_length)
      - else
        %h1.gl-mt-3.gl-ml-5
          = @topic.title_or_name
    - if @topic.description.present?
      .topic-description
        = markdown(@topic.description)

%div{ class: container_class }
  .gl-py-5.gl-border-gray-100.gl-border-b-solid.gl-border-b-1
    %h3.gl-m-0= _('Projects with this topic')
  .top-area.gl-pt-2.gl-pb-2.gl-justify-content-space-between
    .nav-controls
      = render 'shared/projects/search_form'
      = render 'filter'
    = link_button_to nil, topic_explore_projects_path(@topic.name, rss_url_options), title: s_("Topics|Subscribe to the new projects feed"), class: 'd-none d-sm-inline-flex has-tooltip', icon: 'rss'

  = render 'projects', projects: @projects
